
<script type="text/javascript">
	$(function(){
		$("#tblTest").jqGrid({
			url:"index.php?r=test/getData",
			datatype: 'json',
			pager: '#navTblTest',
			width:'600',
		    colNames:['id','nama', 'umur'],
		    colModel :[ 
		      {name:'id', index:'id', width:55, sorttype:'int'}, 
		      {name:'name', index:'name', width:90, sorttype:'', }, 
		      {name:'tahun_ajaran_id', index:'tahun_ajaran_id', width:80, align:'right', sorttype:'int'}, 
		    ],
		    rowList:[10,20,50],
		    jsonReader : {root:"rows"},		    
		});
	});
	function cari(){
		$("#tblTest").jqGrid("setGridParam",{postData:{search:$("#txtSearch").val()}}).trigger("reloadGrid",[{current:true}]);
	}
</script>

<div>
	<input id="txtSearch" class="ui-pg-input"  name="txtSearch" type="search" value="" onkeyup="cari()" onsearch="cari()"/>
	<table id="tblTest"><tr><td></td></tr></table>
	<div id="navTblTest"></div>
</div>